<template>
    <div _tmplitem="29" class="dv-full-screen-container" :style="css">
        <div _tmplitem="29" style="position: absolute;width:1920px;height:1080px; background-image: url(/public/back.jpg); background-size: contain;background-color:rgba(13, 42, 67);" class="div-full-screen">
            <div _tmplitem="29" class="bigitem" style="top: 24px; left: 791px; width: 300px; height: 40px; transform: translate(0px, 0px); z-index: 1028;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:20px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <titlecontrol _tmplitem="1" ref="sel169095043476957" :w="300" :h="40" :val="fromData.sel169095043476957" cssstyle="opacity:1;font-size:20px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);"></titlecontrol>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 422px; left: 407px; width: 113px; height: 40px; transform: translate(0px, 0px); z-index: 1027;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:14px ;color:rgba(23, 213, 70, 1) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <titlecontrol _tmplitem="2" ref="sel16909513385766" :w="113" :h="40" :val="fromData.sel16909513385766" cssstyle="opacity:1;font-size:14px ;color:rgba(23, 213, 70, 1) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);"></titlecontrol>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 424px; left: 236px; width: 300px; height: 40px; transform: translate(0px, 0px); z-index: 1026;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:18px ;color:rgba(20, 178, 245, 1) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <titlecontrol _tmplitem="3" ref="sel169095129720244" :w="300" :h="40" :val="fromData.sel169095129720244" cssstyle="opacity:1;font-size:18px ;color:rgba(20, 178, 245, 1) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);"></titlecontrol>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 478px; left: 115px; width: 412px; height: 193px; transform: translate(0px, 0px); z-index: 1025;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <myechart _tmplitem="4" ref="sel169095118673651" :options="fromData.sel169095118673651"></myechart>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 758px; left: 993px; width: 362px; height: 257px; transform: translate(0px, 0px); z-index: 1024;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <myechart _tmplitem="5" ref="sel169095107162350" :options="fromData.sel169095107162350"></myechart>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 0px; left: 0px; width: 300px; height: 200px; transform: translate(0px, 0px); z-index: 1023;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <myechart _tmplitem="6" ref="" :options="fromData.undefined"></myechart>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 754px; left: 588px; width: 357px; height: 263px; transform: translate(0px, 0px); z-index: 1022;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <myechart _tmplitem="7" ref="sel169095103264660" :options="fromData.sel169095103264660"></myechart>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 744px; left: 1354px; width: 483px; height: 280px; transform: translate(0px, 0px); z-index: 1021;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <myechart _tmplitem="8" ref="sel169095101275541" :options="fromData.sel169095101275541"></myechart>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 337px; left: 1383px; width: 441px; height: 332px; transform: translate(0px, 0px); z-index: 1020;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <myechart _tmplitem="9" ref="sel169095099642381" :options="fromData.sel169095099642381"></myechart>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 77px; left: 1409px; width: 404px; height: 200px; transform: translate(0px, 0px); z-index: 1019;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <myechart _tmplitem="10" ref="sel169095085948150" :options="fromData.sel169095085948150"></myechart>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 153px; left: 429px; width: 80px; height: 49px; transform: translate(0px, 0px); z-index: 1018;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:26px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:rotateZ(0deg)rotateY(0deg)   rotateX(0deg) ;">
                    <dv-digital-flop ref="sel16909505351524" :config="fromData.sel16909505351524" style="width:80px;height:49px"> </dv-digital-flop>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 77px; left: 1621px; width: 300px; height: 45px; transform: translate(0px, 0px); z-index: 1017;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:19px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <titlecontrol _tmplitem="12" ref="sel169095049511788" :w="300" :h="45" :val="fromData.sel169095049511788" cssstyle="opacity:1;font-size:19px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);"></titlecontrol>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 769px; left: 247px; width: 80px; height: 49px; transform: translate(0px, 0px); z-index: 1016;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:26px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:rotateZ(0deg)rotateY(0deg)   rotateX(0deg) ;">
                    <dv-digital-flop ref="sel169095056546012" :config="fromData.sel169095056546012" style="width:80px;height:49px"> </dv-digital-flop>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 914px; left: 243px; width: 80px; height: 49px; transform: translate(0px, 0px); z-index: 1015;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:26px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:rotateZ(0deg)rotateY(0deg)   rotateX(0deg) ;">
                    <dv-digital-flop ref="sel169095057820764" :config="fromData.sel169095057820764" style="width:80px;height:49px"> </dv-digital-flop>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 77px; left: 800px; width: 300px; height: 45px; transform: translate(0px, 0px); z-index: 1014;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:19px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <titlecontrol _tmplitem="15" ref="sel169095067389426" :w="300" :h="45" :val="fromData.sel169095067389426" cssstyle="opacity:1;font-size:19px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);"></titlecontrol>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 151px; left: 140px; width: 80px; height: 49px; transform: translate(0px, 0px); z-index: 1013;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:26px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:rotateZ(0deg)rotateY(0deg)   rotateX(0deg) ;">
                    <dv-digital-flop ref="sel169095071876345" :config="fromData.sel169095071876345" style="width:80px;height:49px"> </dv-digital-flop>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 155px; left: 284px; width: 80px; height: 49px; transform: translate(0px, 0px); z-index: 1012;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:26px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:rotateZ(0deg)rotateY(0deg)   rotateX(0deg) ;">
                    <dv-digital-flop ref="sel169095072774472" :config="fromData.sel169095072774472" style="width:80px;height:49px"> </dv-digital-flop>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 837px; left: 244px; width: 80px; height: 49px; transform: translate(0px, 0px); z-index: 1011;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:26px ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:rotateZ(0deg)rotateY(0deg)   rotateX(0deg) ;">
                    <dv-digital-flop ref="sel169095074116738" :config="fromData.sel169095074116738" style="width:80px;height:49px"> </dv-digital-flop>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 716px; left: 554px; width: 300px; height: 35px; transform: translate(0px, 0px); z-index: 1010;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:19px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <titlecontrol _tmplitem="19" ref="sel169095079294431" :w="300" :h="35" :val="fromData.sel169095079294431" cssstyle="opacity:1;font-size:19px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);"></titlecontrol>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 77px; left: -4px; width: 300px; height: 45px; transform: translate(0px, 0px); z-index: 109;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:19px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <titlecontrol _tmplitem="20" ref="sel16909508843781" :w="300" :h="45" :val="fromData.sel16909508843781" cssstyle="opacity:1;font-size:19px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);"></titlecontrol>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 292px; left: 56px; width: 300px; height: 45px; transform: translate(0px, 0px); z-index: 108;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:19px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <titlecontrol _tmplitem="21" ref="sel169095089656727" :w="300" :h="45" :val="fromData.sel169095089656727" cssstyle="opacity:1;font-size:19px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);"></titlecontrol>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 302px; left: 1371px; width: 300px; height: 35px; transform: translate(0px, 0px); z-index: 107;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:19px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <titlecontrol _tmplitem="22" ref="sel169095091840497" :w="300" :h="35" :val="fromData.sel169095091840497" cssstyle="opacity:1;font-size:19px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);"></titlecontrol>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 708px; left: 67px; width: 300px; height: 35px; transform: translate(0px, 0px); z-index: 106;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:19px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <titlecontrol _tmplitem="23" ref="sel169095092383979" :w="300" :h="35" :val="fromData.sel169095092383979" cssstyle="opacity:1;font-size:19px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);"></titlecontrol>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 715px; left: 960px; width: 300px; height: 35px; transform: translate(0px, 0px); z-index: 105;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:19px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <titlecontrol _tmplitem="24" ref="sel169095094520414" :w="300" :h="35" :val="fromData.sel169095094520414" cssstyle="opacity:1;font-size:19px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);"></titlecontrol>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 718px; left: 1387px; width: 300px; height: 35px; transform: translate(0px, 0px); z-index: 104;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:19px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <titlecontrol _tmplitem="25" ref="sel169095095768707" :w="300" :h="35" :val="fromData.sel169095095768707" cssstyle="opacity:1;font-size:19px ;color:rgb(255, 255, 255) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);"></titlecontrol>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 424px; left: 23px; width: 300px; height: 40px; transform: translate(0px, 0px); z-index: 103;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:18px ;color:rgba(20, 178, 245, 1) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <titlecontrol _tmplitem="26" ref="sel169095146516323" :w="300" :h="40" :val="fromData.sel169095146516323" cssstyle="opacity:1;font-size:18px ;color:rgba(20, 178, 245, 1) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);"></titlecontrol>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 424px; left: 23px; width: 300px; height: 40px; transform: translate(0px, 0px); z-index: 102;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:18px ;color:rgba(20, 178, 245, 1) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <titlecontrol _tmplitem="27" ref="sel169095148133038" :w="300" :h="40" :val="fromData.sel169095148133038" cssstyle="opacity:1;font-size:18px ;color:rgba(20, 178, 245, 1) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);"></titlecontrol>
                </div>
            </div>
            <div _tmplitem="29" class="bigitem" style="top: 422px; left: 182px; width: 113px; height: 40px; transform: translate(0px, 0px); z-index: 101;">
                <div _tmplitem="29" class="itemcontent " style="opacity:1;font-size:14px ;color:rgba(23, 213, 70, 1) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);">
                    <titlecontrol _tmplitem="28" ref="sel169095149619849" :w="113" :h="40" :val="fromData.sel169095149619849" cssstyle="opacity:1;font-size:14px ;color:rgba(23, 213, 70, 1) ;border-radius:0px;border-width:0px ;border-style:solid ;--animation:2s;--animation-flash:0.2s;transform:  rotateX(0deg) rotateY(0deg) rotateZ(0deg);"></titlecontrol>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
    import myechart from '@/components/myechart/newindex.vue'
    import titlecontrol from '@/components/titlecontrol.vue'
    import horseindex from '@/components/horseindex.vue'
    import textareaindex from '@/components/textareaindex.vue'
    import backgroundunit1 from '@/components/backgroundunit/backgroundunit1.vue'
    import backgroundunit2 from '@/components/backgroundunit/backgroundunit2.vue'
    import backgroundunit3 from '@/components/backgroundunit/backgroundunit3.vue'
    import backgroundunit4 from '@/components/backgroundunit/backgroundunit4.vue'
    import backgroundunit5 from '@/components/backgroundunit/backgroundunit5.vue'
    import backgroundunit7 from '@/components/backgroundunit/backgroundunit7.vue'
    import backgroundunit8 from '@/components/backgroundunit/backgroundunit8.vue'
    import backgroundunit9 from '@/components/backgroundunit/backgroundunit9.vue'
    import backgroundunit10 from '@/components/backgroundunit/backgroundunit10.vue'
    import backgroundunit11 from '@/components/backgroundunit/backgroundunit11.vue'
    import backgroundunit12 from '@/components/backgroundunit/backgroundunit12.vue'
    import myfabric from '@/components/myfabric/hotspot.vue'
    import bigimg from '@/components/bigImg.vue'
    import scrollgridlist from '@/components/scrollgridlist/index.vue'
    import scrollgridcolumn from '@/components/scrollgridlist/scrollgridcolumn.vue'
    import { commGetApi} from './api/index'
import { set } from 'vue/types/umd'
    export default {
        data() {
            return {
                "w": 1920,
                "css": "",
                "h": 1080,
                "bg": "/temp/27daf3d81105d75c742ada59c93e1ee6.jpg",
                "bgColor": "rgba(13, 42, 67)",
                "fromData": {
                    "sel169095043476957": "XX工厂生产可视化大屏",
                    "sel16909513385766": "562",
                    "sel169095129720244": "昨日总数：",
                    "sel169095118673651": {
                        "title": [{
                            "text": "本年收缴率",
                            "x": "22%",
                            "y": "70%",
                            "textStyle": {
                                "fontSize": 14,
                                "fontWeight": "100",
                                "color": "#fff",
                                "lineHeight": 16,
                                "textAlign": "center"
                            }
                        }, {
                            "text": "本月收缴率",
                            "x": "73%",
                            "y": "70%",
                            "textStyle": {
                                "fontSize": 14,
                                "fontWeight": "100",
                                "color": "#fff",
                                "lineHeight": 16,
                                "textAlign": "center"
                            }
                        }],
                        "series": [{
                            "type": "liquidFill",
                            "radius": "47%",
                            "center": ["25%", "45%"],
                            "color": [{
                                "type": "linear",
                                "x": 0,
                                "y": 0,
                                "x2": 0,
                                "y2": 1,
                                "colorStops": [{
                                    "offset": 0,
                                    "color": "#446bf5"
                                }, {
                                    "offset": 1,
                                    "color": "#2ca3e2"
                                }],
                                "globalCoord": false
                            }],
                            "data": [0.45, 0.45],
                            "backgroundStyle": {
                                "borderWidth": 1,
                                "color": "RGBA(51, 66, 127, 0.7)"
                            },
                            "label": {
                                "normal": {
                                    "textStyle": {
                                        "fontSize": 25,
                                        "color": "#fff"
                                    }
                                }
                            },
                            "outline": {
                                "borderDistance": 0,
                                "itemStyle": {
                                    "borderWidth": 2,
                                    "borderColor": "#112165",
                                    "color": "rgb(73, 146, 255)"
                                }
                            }
                        }, {
                            "type": "liquidFill",
                            "radius": "47%",
                            "center": ["75%", "45%"],
                            "color": [{
                                "type": "linear",
                                "x": 0,
                                "y": 0,
                                "x2": 0,
                                "y2": 1,
                                "colorStops": [{
                                    "offset": 0,
                                    "color": "#2aa1e3"
                                }, {
                                    "offset": 1,
                                    "color": "#08bbc9"
                                }],
                                "globalCoord": false
                            }],
                            "data": [0.76, 0.76],
                            "backgroundStyle": {
                                "borderWidth": 1,
                                "color": "RGBA(51, 66, 127, 0.7)"
                            },
                            "label": {
                                "normal": {
                                    "textStyle": {
                                        "fontSize": 28,
                                        "color": "#fff"
                                    }
                                }
                            },
                            "outline": {
                                "borderDistance": 0,
                                "itemStyle": {
                                    "borderWidth": 2,
                                    "borderColor": "#112165",
                                    "color": "rgb(124, 255, 178)"
                                }
                            }
                        }]
                    },
                    "sel169095107162350": {
                        "grid": {
                            "left": "5%",
                            "top": "5%",
                            "bottom": "5%",
                            "right": "5%"
                        },
                        "legend": {
                            "type": "scroll",
                            "data": ["云篆山水路线", "昕博朗学校路线", "新华小学路线", "云锦五路路线"],
                            "itemWidth": 18,
                            "itemHeight": 12,
                            "textStyle": {
                                "color": "#fff",
                                "fontSize": 14
                            }
                        },
                        "yAxis": [{
                            "type": "value",
                            "position": "right",
                            "splitLine": {
                                "show": false
                            },
                            "axisLine": {
                                "show": false
                            },
                            "axisTick": {
                                "show": false
                            },
                            "axisLabel": {
                                "show": false,
                                "color": "#fff"
                            }
                        }, {
                            "type": "value",
                            "position": "left",
                            "nameTextStyle": {
                                "color": "#fff"
                            },
                            "splitLine": {
                                "lineStyle": {
                                    "type": "dashed",
                                    "color": "rgba(135,140,147,0.8)"
                                }
                            },
                            "axisLine": {
                                "show": false
                            },
                            "axisTick": {
                                "show": false
                            },
                            "axisLabel": {
                                "formatter": "{value}",
                                "color": "#fff",
                                "fontSize": 14
                            }
                        }],
                        "xAxis": [{
                            "type": "category",
                            "axisTick": {
                                "show": false
                            },
                            "axisLine": {
                                "show": false,
                                "lineStyle": {
                                    "color": "#fff"
                                }
                            },
                            "axisLabel": {
                                "inside": false,
                                "textStyle": {
                                    "color": "#fff",
                                    "fontWeight": "normal",
                                    "fontSize": "14",
                                    "lineHeight": 22
                                },
                                "color": "#fff"
                            },
                            "data": ["周一", "周二", "周三", "周四", "周五", "周六", "周日"]
                        }, {
                            "type": "category",
                            "axisLine": {
                                "show": false
                            },
                            "axisTick": {
                                "show": false
                            },
                            "axisLabel": {
                                "show": false,
                                "color": "#fff"
                            },
                            "splitArea": {
                                "show": false
                            },
                            "splitLine": {
                                "show": false
                            },
                            "data": ["1月", "2月", "3月", "4月", "5月", "6月"]
                        }],
                        "series": [{
                            "symbolSize": 150,
                            "symbol": "image://",
                            "name": "云篆山水路线",
                            "type": "line",
                            "yAxisIndex": 1,
                            "data": [123, 154, 234, 321, 120, 390, 634],
                            "itemStyle": {
                                "normal": {
                                    "borderWidth": 5,
                                    "color": "rgb(73, 146, 255)"
                                },
                                "color": "rgb(73, 146, 255)"
                            }
                        }, {
                            "symbolSize": 150,
                            "symbol": "image://",
                            "name": "昕博朗学校路线",
                            "type": "line",
                            "yAxisIndex": 1,
                            "data": [63, 194, 234, 321, 278, 110, 534],
                            "itemStyle": {
                                "normal": {
                                    "borderWidth": 5,
                                    "color": "rgb(124, 255, 178)"
                                },
                                "color": "rgb(124, 255, 178)"
                            }
                        }, {
                            "symbolSize": 150,
                            "symbol": "image://",
                            "name": "新华小学路线",
                            "type": "line",
                            "yAxisIndex": 1,
                            "data": [53, 254, 234, 321, 118, 240, 434],
                            "itemStyle": {
                                "normal": {
                                    "borderWidth": 5,
                                    "color": "rgb(253, 221, 96)"
                                },
                                "color": "rgb(253, 221, 96)"
                            }
                        }, {
                            "symbolSize": 150,
                            "symbol": "image://",
                            "name": "云锦五路路线",
                            "type": "line",
                            "yAxisIndex": 1,
                            "data": [23, 354, 334, 221, 178, 190, 234],
                            "itemStyle": {
                                "normal": {
                                    "borderWidth": 5,
                                    "color": "rgb(255, 110, 118)"
                                },
                                "color": "rgb(255, 110, 118)"
                            }
                        }]
                    },
                    "sel169095103264660": {
                        "color": ["#3398DB"],
                        "tooltip": {
                            "trigger": "axis",
                            "axisPointer": {
                                "type": "line",
                                "lineStyle": {
                                    "opacity": 0
                                }
                            }
                        },
                        "legend": {
                            "data": ["直接访问", "背景"],
                            "show": false
                        },
                        "grid": {
                            "left": "0%",
                            "right": "0%",
                            "bottom": "5%",
                            "top": "7%",
                            "height": "85%",
                            "containLabel": true,
                            "z": 22
                        },
                        "xAxis": [{
                            "type": "category",
                            "gridIndex": 0,
                            "data": ["一月", "二月", "三月", "四月", "五月", "六月", "七月"],
                            "axisTick": {
                                "alignWithLabel": true
                            },
                            "axisLine": {
                                "lineStyle": {
                                    "color": "#fff"
                                }
                            },
                            "axisLabel": {
                                "show": true,
                                "color": "#fff",
                                "fontSize": 16
                            }
                        }],
                        "yAxis": [{
                            "type": "value",
                            "gridIndex": 0,
                            "splitLine": {
                                "show": false
                            },
                            "axisTick": {
                                "show": false
                            },
                            "min": 50,
                            "max": 100,
                            "axisLine": {
                                "lineStyle": {
                                    "color": "#fff"
                                }
                            },
                            "axisLabel": {
                                "color": "#fff",
                                "formatter": "{value} %"
                            }
                        }, {
                            "type": "value",
                            "gridIndex": 0,
                            "min": 50,
                            "max": 100,
                            "splitNumber": 12,
                            "splitLine": {
                                "show": false
                            },
                            "axisLine": {
                                "show": false
                            },
                            "axisTick": {
                                "show": false
                            },
                            "axisLabel": {
                                "show": false,
                                "color": "#fff"
                            },
                            "splitArea": {
                                "show": true,
                                "areaStyle": {
                                    "color": ["rgba(250,250,250,0.0)", "rgba(250,250,250,0.05)"]
                                }
                            }
                        }],
                        "series": [{
                            "name": "合格率",
                            "type": "bar",
                            "barWidth": "30%",
                            "xAxisIndex": 0,
                            "yAxisIndex": 0,
                            "itemStyle": {
                                "normal": {
                                    "barBorderRadius": 30,
                                    "color": "rgb(73, 146, 255)"
                                },
                                "color": "rgb(73, 146, 255)"
                            },
                            "data": [80, 87.8, 71, 80, 66, 80, 80],
                            "zlevel": 11
                        }, {
                            "name": "背景",
                            "type": "bar",
                            "barWidth": "50%",
                            "xAxisIndex": 0,
                            "yAxisIndex": 1,
                            "barGap": "-135%",
                            "data": [100, 100, 100, 100, 100, 100, 100],
                            "itemStyle": {
                                "normal": {
                                    "color": "rgb(124, 255, 178)"
                                },
                                "color": "rgb(124, 255, 178)"
                            },
                            "zlevel": 9
                        }]
                    },
                    "sel169095101275541": {
                        "color": ["#EAEA26", "#906BF9", "#FE5656", "#01E17E", "#3DD1F9", "#FFAD05"],
                        "grid": {
                            "left": -100,
                            "top": 50,
                            "bottom": 10,
                            "right": 10,
                            "containLabel": true
                        },
                        "tooltip": {
                            "trigger": "item",
                            "formatter": "{b} : {c} ({d}%)"
                        },
                        "legend": {
                            "type": "scroll",
                            "orient": "vartical",
                            "top": "center",
                            "right": "15",
                            "itemWidth": 16,
                            "itemHeight": 8,
                            "itemGap": 16,
                            "textStyle": {
                                "color": "#fff",
                                "fontSize": 12,
                                "fontWeight": 0
                            },
                            "data": ["IDS", "VPN", "交换机", "防火墙", "WAF", "堡垒机"]
                        },
                        "polar": {},
                        "angleAxis": {
                            "interval": 1,
                            "type": "category",
                            "data": [],
                            "z": 10,
                            "axisLine": {
                                "show": false,
                                "lineStyle": {
                                    "color": "#fff",
                                    "width": 1,
                                    "type": "solid"
                                }
                            },
                            "axisLabel": {
                                "interval": 0,
                                "show": true,
                                "color": "#fff",
                                "margin": 8,
                                "fontSize": 16
                            }
                        },
                        "radiusAxis": {
                            "min": 40,
                            "max": 120,
                            "interval": 20,
                            "axisLine": {
                                "show": false,
                                "lineStyle": {
                                    "color": "#fff",
                                    "width": 1,
                                    "type": "solid"
                                }
                            },
                            "axisLabel": {
                                "formatter": "{value} %",
                                "show": false,
                                "padding": [0, 0, 20, 0],
                                "color": "#fff",
                                "fontSize": 16
                            },
                            "splitLine": {
                                "lineStyle": {
                                    "color": "#0B3E5E",
                                    "width": 2,
                                    "type": "solid"
                                }
                            }
                        },
                        "calculable": true,
                        "series": [{
                            "type": "pie",
                            "radius": ["5%", "10%"],
                            "hoverAnimation": false,
                            "labelLine": {
                                "normal": {
                                    "show": false,
                                    "length": 30,
                                    "length2": 55
                                },
                                "emphasis": {
                                    "show": false
                                }
                            },
                            "data": [{
                                "name": "",
                                "value": 0,
                                "itemStyle": {
                                    "normal": {
                                        "color": "rgb(73, 146, 255)"
                                    },
                                    "color": "rgb(73, 146, 255)"
                                }
                            }]
                        }, {
                            "type": "pie",
                            "radius": ["90%", "95%"],
                            "hoverAnimation": false,
                            "labelLine": {
                                "normal": {
                                    "show": false,
                                    "length": 30,
                                    "length2": 55
                                },
                                "emphasis": {
                                    "show": false
                                }
                            },
                            "name": "",
                            "data": [{
                                "name": "",
                                "value": 0,
                                "itemStyle": {
                                    "normal": {
                                        "color": "rgb(124, 255, 178)"
                                    },
                                    "color": "rgb(124, 255, 178)"
                                }
                            }]
                        }, {
                            "stack": "a",
                            "type": "pie",
                            "radius": ["20%", "80%"],
                            "roseType": "area",
                            "zlevel": 10,
                            "label": {
                                "normal": {
                                    "show": true,
                                    "formatter": "{c}",
                                    "textStyle": {
                                        "fontSize": 12,
                                        "color": "#fff"
                                    },
                                    "position": "outside"
                                },
                                "emphasis": {
                                    "show": true
                                }
                            },
                            "labelLine": {
                                "normal": {
                                    "show": true,
                                    "length": 20,
                                    "length2": 55
                                },
                                "emphasis": {
                                    "show": false
                                }
                            },
                            "data": [{
                                "value": 10,
                                "name": "IDS"
                            }, {
                                "value": 5,
                                "name": "VPN"
                            }, {
                                "value": 15,
                                "name": "交换机"
                            }, {
                                "value": 25,
                                "name": "防火墙"
                            }, {
                                "value": 20,
                                "name": "WAF"
                            }, {
                                "value": 35,
                                "name": "堡垒机"
                            }]
                        }]
                    },
                    "sel169095099642381": {
                        "normal": {
                            "top": 200,
                            "left": 300,
                            "width": 500,
                            "height": 400,
                            "zIndex": 6,
                            "backgroundColor": ""
                        },
                        "color": ["rgba(245, 166, 35, 1)", "rgba(19, 173, 255, 1)"],
                        "title": {
                            "show": true,
                            "text": "基础雷达图",
                            "left": "40%",
                            "top": "1%",
                            "textStyle": {
                                "fontSize": 18,
                                "color": "#fff",
                                "fontStyle": "normal",
                                "fontWeight": "normal"
                            }
                        },
                        "tooltip": {
                            "show": true,
                            "trigger": "item"
                        },
                        "legend": {
                            "show": true,
                            "icon": "circle",
                            "left": "35%",
                            "top": "90%",
                            "orient": "horizontal",
                            "textStyle": {
                                "fontSize": 14,
                                "color": "#fff"
                            },
                            "data": ["数据1", "数据2"]
                        },
                        "radar": {
                            "center": ["50%", "50%"],
                            "radius": "70%",
                            "startAngle": 90,
                            "splitNumber": 4,
                            "shape": "circle",
                            "splitArea": {
                                "areaStyle": {
                                    "color": ["transparent"]
                                }
                            },
                            "axisLabel": {
                                "show": false,
                                "fontSize": 18,
                                "color": "#fff",
                                "fontStyle": "normal",
                                "fontWeight": "normal"
                            },
                            "axisLine": {
                                "show": true,
                                "lineStyle": {
                                    "color": "#fff"
                                }
                            },
                            "splitLine": {
                                "show": true,
                                "lineStyle": {
                                    "color": "grey"
                                }
                            },
                            "indicator": [{
                                "name": "道路结冰",
                                "max": 88
                            }, {
                                "name": "暴雪",
                                "max": 88
                            }, {
                                "name": "暴雨",
                                "max": 88
                            }, {
                                "name": "冰雹",
                                "max": 88
                            }, {
                                "name": "大风",
                                "max": 88
                            }, {
                                "name": "大雾",
                                "max": 88
                            }, {
                                "name": "高温",
                                "max": 88
                            }, {
                                "name": "干旱",
                                "max": 88
                            }, {
                                "name": "寒潮",
                                "max": 88
                            }, {
                                "name": "雷电",
                                "max": 88
                            }, {
                                "name": "霾",
                                "max": 88
                            }, {
                                "name": "沙尘暴",
                                "max": 88
                            }, {
                                "name": "霜冻",
                                "max": 88
                            }, {
                                "name": "台风",
                                "max": 88
                            }, {
                                "name": "洪水",
                                "max": 88
                            }]
                        },
                        "series": [{
                            "name": "数据1",
                            "type": "radar",
                            "symbol": "circle",
                            "symbolSize": 10,
                            "areaStyle": {
                                "normal": {
                                    "color": "rgba(245, 166, 35, 0.4)"
                                }
                            },
                            "itemStyle": {
                                "color": "rgb(73, 146, 255)",
                                "borderColor": "rgba(245, 166, 35, 0.3)",
                                "borderWidth": 10
                            },
                            "lineStyle": {
                                "normal": {
                                    "type": "dashed",
                                    "color": "rgba(245, 166, 35, 1)",
                                    "width": 2
                                },
                                "color": "rgb(73, 146, 255)"
                            },
                            "data": [
                                [80, 50, 55, 80, 50, 80, 48, 43, 60, 78, 60, 40, 42, 44, 65]
                            ]
                        }, {
                            "name": "数据2",
                            "type": "radar",
                            "symbol": "circle",
                            "symbolSize": 10,
                            "itemStyle": {
                                "normal": {
                                    "color": "rgb(124, 255, 178)",
                                    "borderColor": "rgba(19, 173, 255, 0.4)",
                                    "borderWidth": 10
                                },
                                "color": "rgb(124, 255, 178)"
                            },
                            "areaStyle": {
                                "normal": {
                                    "color": "rgba(19, 173, 255, 0.5)"
                                }
                            },
                            "lineStyle": {
                                "normal": {
                                    "color": "rgba(19, 173, 255, 1)",
                                    "width": 2,
                                    "type": "dashed"
                                },
                                "color": "rgb(124, 255, 178)"
                            },
                            "data": [
                                [60, 60, 65, 60, 70, 40, 80, 63, 68, 60, 77, 60, 80, 62, 80]
                            ]
                        }]
                    },
                    "sel169095085948150": {
                        "title": [{
                            "text": "正面评论",
                            "left": "29.8%",
                            "top": "60%",
                            "textAlign": "center",
                            "textStyle": {
                                "fontWeight": "normal",
                                "fontSize": "16",
                                "color": "#fff",
                                "textAlign": "center"
                            }
                        }, {
                            "text": "负面评论",
                            "left": "70%",
                            "top": "60%",
                            "textAlign": "center",
                            "textStyle": {
                                "color": "#fff",
                                "fontWeight": "normal",
                                "fontSize": "16",
                                "textAlign": "center"
                            }
                        }],
                        "series": [{
                            "type": "pie",
                            "hoverAnimation": false,
                            "radius": ["25%", "30%"],
                            "center": ["30%", "50%"],
                            "startAngle": 225,
                            "labelLine": {
                                "normal": {
                                    "show": false
                                }
                            },
                            "label": {
                                "normal": {
                                    "position": "center"
                                }
                            },
                            "data": [{
                                "value": 100,
                                "itemStyle": {
                                    "normal": {
                                        "color": "rgb(73, 146, 255)"
                                    },
                                    "color": "rgb(73, 146, 255)"
                                }
                            }, {
                                "value": 35,
                                "itemStyle": {
                                    "normal": {
                                        "label": {
                                            "show": false
                                        },
                                        "labelLine": {
                                            "show": false
                                        },
                                        "color": "rgb(255, 110, 118)",
                                        "borderWidth": 0
                                    },
                                    "emphasis": {
                                        "color": "rgba(0,0,0,0)",
                                        "borderWidth": 0
                                    },
                                    "color": "rgb(255, 110, 118)"
                                }
                            }]
                        }, {
                            "type": "pie",
                            "hoverAnimation": false,
                            "radius": ["25%", "30%"],
                            "center": ["30%", "50%"],
                            "startAngle": 225,
                            "labelLine": {
                                "normal": {
                                    "show": false
                                }
                            },
                            "label": {
                                "normal": {
                                    "position": "center"
                                }
                            },
                            "data": [{
                                "value": 75,
                                "itemStyle": {
                                    "normal": {
                                        "color": "rgb(124, 255, 178)"
                                    },
                                    "color": "rgb(124, 255, 178)"
                                },
                                "label": {
                                    "normal": {
                                        "formatter": "{c}%",
                                        "position": "center",
                                        "show": true,
                                        "textStyle": {
                                            "fontSize": "40",
                                            "fontWeight": "normal",
                                            "color": "#fff"
                                        }
                                    }
                                }
                            }, {
                                "value": 35,
                                "itemStyle": {
                                    "normal": {
                                        "label": {
                                            "show": false
                                        },
                                        "labelLine": {
                                            "show": false
                                        },
                                        "color": "rgb(255, 110, 118)",
                                        "borderWidth": 0
                                    },
                                    "emphasis": {
                                        "color": "rgba(0,0,0,0)",
                                        "borderWidth": 0
                                    },
                                    "color": "rgb(255, 110, 118)"
                                }
                            }]
                        }, {
                            "type": "pie",
                            "hoverAnimation": false,
                            "radius": ["25%", "30%"],
                            "center": ["70%", "50%"],
                            "startAngle": 225,
                            "labelLine": {
                                "normal": {
                                    "show": false
                                }
                            },
                            "label": {
                                "normal": {
                                    "position": "center"
                                }
                            },
                            "data": [{
                                "value": 100,
                                "itemStyle": {
                                    "normal": {
                                        "color": "rgb(253, 221, 96)"
                                    },
                                    "color": "rgb(253, 221, 96)"
                                }
                            }, {
                                "value": 35,
                                "itemStyle": {
                                    "normal": {
                                        "label": {
                                            "show": false
                                        },
                                        "labelLine": {
                                            "show": false
                                        },
                                        "color": "rgb(255, 110, 118)",
                                        "borderWidth": 0
                                    },
                                    "emphasis": {
                                        "color": "rgba(0,0,0,0)",
                                        "borderWidth": 0
                                    },
                                    "color": "rgb(255, 110, 118)"
                                }
                            }]
                        }, {
                            "type": "pie",
                            "hoverAnimation": false,
                            "radius": ["25%", "30%"],
                            "center": ["70%", "50%"],
                            "startAngle": 225,
                            "labelLine": {
                                "normal": {
                                    "show": false
                                }
                            },
                            "label": {
                                "normal": {
                                    "position": "center"
                                }
                            },
                            "data": [{
                                "value": 30,
                                "itemStyle": {
                                    "normal": {
                                        "color": "rgb(255, 110, 118)"
                                    },
                                    "color": "rgb(255, 110, 118)"
                                },
                                "label": {
                                    "normal": {
                                        "formatter": "{c}%",
                                        "position": "center",
                                        "show": true,
                                        "textStyle": {
                                            "fontSize": "40",
                                            "fontWeight": "normal",
                                            "color": "#fff"
                                        }
                                    }
                                }
                            }, {
                                "value": 55,
                                "itemStyle": {
                                    "normal": {
                                        "label": {
                                            "show": false
                                        },
                                        "labelLine": {
                                            "show": false
                                        },
                                        "color": "rgb(255, 110, 118)",
                                        "borderWidth": 0
                                    },
                                    "emphasis": {
                                        "color": "rgba(0,0,0,0)",
                                        "borderWidth": 0
                                    },
                                    "color": "rgb(255, 110, 118)"
                                }
                            }]
                        }]
                    },
                    "sel16909505351524": {
                        "number": [152],
                        "content": "{nt}个",
                        "toFixed": 0,
                        "textAlign": "left",
                        "style": {
                            "fontSize": 26,
                            "fill": "rgb(255, 255, 255)"
                        }
                    },
                    "sel169095049511788": "今日生产情况",
                    "sel169095056546012": {
                        "number": [352],
                        "content": "{nt}个",
                        "toFixed": 0,
                        "textAlign": "left",
                        "style": {
                            "fontSize": 26,
                            "fill": "rgb(255, 255, 255)"
                        }
                    },
                    "sel169095057820764": {
                        "number": [200],
                        "content": "{nt}个",
                        "toFixed": 0,
                        "textAlign": "left",
                        "style": {
                            "fontSize": 26,
                            "fill": "rgb(255, 255, 255)"
                        }
                    },
                    "sel169095067389426": "A生产间",
                    "sel169095071876345": {
                        "number": [352],
                        "content": "{nt}个",
                        "toFixed": 0,
                        "textAlign": "left",
                        "style": {
                            "fontSize": 26,
                            "fill": "rgb(255, 255, 255)"
                        }
                    },
                    "sel169095072774472": {
                        "number": [200],
                        "content": "{nt}个",
                        "toFixed": 0,
                        "textAlign": "left",
                        "style": {
                            "fontSize": 26,
                            "fill": "rgb(255, 255, 255)"
                        }
                    },
                    "sel169095074116738": {
                        "number": [200],
                        "content": "{nt}个",
                        "toFixed": 0,
                        "textAlign": "left",
                        "style": {
                            "fontSize": 26,
                            "fill": null
                        }
                    },
                    "sel169095079294431": "今日生产情况",
                    "sel16909508843781": "今日生产情况",
                    "sel169095089656727": "今日生产情况",
                    "sel169095091840497": "今日生产情况",
                    "sel169095092383979": "今日生产情况",
                    "sel169095094520414": "今日生产情况",
                    "sel169095095768707": "今日生产情况",
                    "sel169095146516323": "今日总数：",
                    "sel169095148133038": "今日总数：",
                    "sel169095149619849": "562"
                }
            }
        },
        methods: {
            created_sys() {
                ///系统方法 判断页面大小 使其自动适应
                let $this = this
                this.w = this.w === undefined ? 1920 : this.w
                $this.css = `  width: ${$this.w}px;height: ${$this.h}px; ${$this.bg === "" ? "" : "background-image:url(" + $this.bg + ");background-size: contain;"
                    }  transform: scale(${document.body.clientWidth / $this.w});  ${$this.bgColor === ""
                        ? ""
                        : "background-color:" +
                        $this.bgColor +
                        ";left:calc( 50% - " +
                        $this.w / 2 +
                        "px);"
                    }`

                window.addEventListener("resize", () => {
                    $this.css = `  width: ${$this.w}px;height: ${$this.h}px; ${$this.bg === "" ? "" : "background-image:url(" + $this.bg + ");    background-size: contain;"
                        }  transform: scale(${document.body.clientWidth / $this.w}); ${$this.bgColor === ""
                            ? ""
                            : "background-color:" + $this.bgColor + ";"
                        }`
                })
                $this.css = `transform: scale(${document.body.clientWidth / $this.w})`
                if (this.loadfunmounted_sys !== undefined) {
                    this.loadfunmounted_sys()
                }
            },
            loadfunmounted_sys() {}
    },
    set(option) {
            initoption =>newoptions
        }
        async created() {
            this.created_sys()
            let result =await  commGetApi('http://20181024Mock.com/mode1/tableDataOne');
            console.log('baidu', result)
            set(result)
            if (this.funmounted_sys !== undefined) {
                this.funmounted_sys()
            }
    },

        components: {
            myechart,
            titlecontrol,
            horseindex,
            textareaindex,
            backgroundunit1,
            backgroundunit2,
            backgroundunit3,
            backgroundunit4,
            backgroundunit5,
            backgroundunit7,
            backgroundunit8,
            backgroundunit9,
            backgroundunit10,
            backgroundunit11,
            backgroundunit12,
            bigimg,
            myfabric,
            scrollgridlist,
            scrollgridcolumn
        }
    }
</script>
<style scoped>
    .dv-full-screen-container {
        transform: scale(1);
        position: absolute;
        top: 0px;
        left: 0px;
        overflow: hidden;
        transform-origin: left top;
        z-index: 499;
        font-family: Avenir, Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        width: 1920px;
        height: 1080px;
        background-color: '#040404';
        background-size: cover;
        background-repeat: no-repeat;
    }

    .div-full-screen {
        background-size: cover;
        background-repeat: no-repeat;
    }

    .bigitem {
        position: absolute;
        will-change: transform;
        overflow: hidden;
    }

    .layouttable {
        height: 100%;
        display: flex;
    }

    .layouttable .layouttable-item {
        height: 100%;
        position: relative;
        float: left;
    }

    .itemcontent {
        width: 100%;
        height: 100%;
    }
</style>
<style scoped></style>